import React, { useState } from 'react'

export default function CounterUpdate({increment, decrement, incrementIfOdd, incrementAsync}) {
  const [num, setNum] = useState(3)

  return (
    <div>
      <select value={num} onChange={e => setNum(+e.target.value)}>
        <option value="1">1</option>
        <option value="2">2</option>
        <option value="3">3</option>
      </select>
      <button onClick={() => increment(num)}>增加</button>
      <button onClick={() => decrement(num)}>减少</button>
      <button onClick={() => incrementIfOdd(num)}>奇数增加</button>
      <button onClick={() => incrementAsync(num)}>延迟1秒增加</button>
    </div>
  )
}
